<template>
  <h4>
    大模型开发的医疗保健与远程监测系统
  </h4>

  <hr>

  <table class="table table-striped table-bordered">
    <thead>
      <tr>
        <th scope="col">#</th>
        <th scope="col">名称</th>
        <th scope="col">性别</th>
        <th scope="col">年龄</th>
        <th scope="col">籍贯</th>
        <th scope="col">民族</th>
      </tr>
    </thead>
    <tbody>
      <tr v-for="(item, index) in goodsList" :key="item.id">
        <td>
          <input type="text" v-if="item.inputVisible" class="form-control form-control-sm ipt-tag" v-focus v-model="item.inputValue" @blur="onInputConfig(row)" @keyup.enter="onInputConfig(row)" @keyup.esc="row.inputValue = ''" />
          <button class="btn btn-outline-primary rounded-pill" v-else @click="item.inputVisible = true">+Tag</button>
          <span class="btn btn-outline-dark" v-for="item in item.tags" :key="item">
            {{ item }}
          </span>
        </td>
      </tr>
    </tbody>
  </table>
</template>
<script setup lang="ts">
</script>
<style scoped>

th {
  text-align: center;
}
</style>